permalink: web-clipper/filters
Filters allow you to modify variables in Web Clipper templates. Filters are applied to variables using the syntax {{variable|filter}}
.
prompt
, meta
, selector
, and schema
variables.{{variable|filter1|filter2}}
, and are applied in the order they are added.Convert and modify dates.
date
Converts a date to the specified format, see reference.
{{date|date:"YYYY-MM-DD"}}
converts the current date to "YYYY-MM-DD".date:("outputFormat", "inputFormat")
to specify the input format, e.g. "12/01/2024"|date:("YYYY-MM-DD", "MM/DD/YYYY")
parses "12/01/2024" and returns "2024-12-01"
.date_modify
Modifies a date by adding or subtracting a specified amount of time, see reference.
"2024-12-01"|date_modify:"+1 year"
returns "2025-12-01"
"2024-12-01"|date_modify:"- 2 months"
returns "2024-10-01"
duration
Converts ISO 8601 duration strings or seconds into formatted time strings. Uses tokens: HH
(padded hours), H
(hours), mm
(padded minutes), m
(minutes), ss
(padded seconds), s
(seconds).
"PT1H30M"|duration:"HH:mm:ss"
returns "01:30:00"
."3665"|duration:"H:mm:ss"
returns "1:01:05"
.duration
without any parameters uses HH:mm:ss
over 1 hour, mm:ss
under 1 hour.PT6702S
, PT1H30M
) and plain seconds.Convert text strings from one format to another.
camel
Converts text to camelCase
.
capitalize
Capitalizes the first character of the value and converts the rest to lowercase, e.g. "hELLO wORLD"|capitalize
returns "Hello world"
.
kebab
Converts text to kebab-case
.
lower
Converts text to lowercase
.
pascal
Converts text to PascalCase
.
replace
Replaces occurrences of specified text:
"hello!"|replace:",":""
removes all commas."hello world"|replace:("e":"a","o":"0")
returns "hall0 w0rld"
.""
as the replacement value.: | { } ( ) ' "
should be escaped with a backslash when used in the search term, e.g. \:
to search for a literal colon.Regex is supported using JavaScript regex syntax:
"hello world"|replace:"/[aeiou]/g":"*"
→ "h*ll* w*rld".
"HELLO world"|replace:"/hello/i":"hi"
→ "hi world".
"hello world"|replace:("/[aeiou]/g":"*","/\s+/":"-")
→ "h*ll*-w*rld"
.g
(global), i
(case-insensitive), m
(multiline), s
(dotAll), u
(unicode), y
(sticky).safe_name
Converts text to a safe file name.
safe_name
applies the most conservative sanitization rules.safe_name:os
where os
can be windows
, mac
, or linux
to only apply the rules for that operating system.snake
Converts text to snake_case
.
title
Converts text to Title Case
, e.g. "hello world"|title
returns "Hello World"
.
trim
Removes white space from both ends of a string.
" hello world "|trim
returns "hello world"
.uncamel
Converts camelCase or PascalCase to space-separated words, which you can further format with other filters like title
or capitalize
.
"camelCase"|uncamel
returns "camel case"
."PascalCase"|uncamel
returns "pascal case"
.upper
Converts a value to uppercase, e.g. "hello world"|upper
returns "HELLO WORLD"
.
Apply Basic formatting syntax and Advanced formatting syntax to text.
blockquote
Adds a Markdown quote prefix (>
) to each line of the input.
callout
Creates a callout with optional parameters: {{variable|callout:("type", "title", foldState)}}
type
is the callout type, and defaults to "info"title
is the callout title, and defaults to emptyfoldState
is a boolean to set the fold state (true for folded, false for unfolded, null for not foldable)footnote
Converts an array or object into a list of Markdown footnotes.
["first item","second item"]|footnote
returns: [^1]: first item
etc.{"First Note": "Content 1", "Second Note": "Content 2"}|footnote
returns: [^first-note]: Content 1
etc.fragment_link
Converts strings and arrays into text fragment links. Defaults to "link" for the link text.
highlights|fragment_link
returns Highlight content [link](text-fragment-url)
highlights|fragment_link:"custom title"
returns Highlight content [custom title](text-fragment-url)
image
Converts strings, arrays, or objects into Markdown image syntax.
"image.jpg"|image:"alt text"
returns 
.["image1.jpg","image2.jpg"]|image:"alt text"
returns an array of Markdown image strings with the same alt text for all images.{"image1.jpg": "Alt 1", "image2.jpg": "Alt 2"}|image
returns Markdown image strings with alt text from the object keys.link
Converts strings, arrays, or objects into Markdown link syntax (not to be confused with wikilink).
"url"|link:"author"
returns [author](url)
.["url1","url2"]|link:"author"
returns an array of Markdown links with the same text for all links.{"url1": "Author 1", "url2": "Author 2"}|link
returns Markdown links with the text that matches the object keys.list
Converts an array to a Markdown list.
list
to convert to a bullet list.list:task
to convert to a task list.list:numbered
to convert to a numbered list.list:numbered-task
to convert to a task list with numbers.table
Converts an array or array of objects into a Markdown table:
table:("Column 1", "Column 2", "Column 3")
. When used with a simple array, it automatically breaks the data into rows based on the number of columns specified.wikilink
Converts strings, arrays, or objects into Obsidian wikilink syntax.
"page"|wikilink
returns [[page]]
."page"|wikilink:"alias"
returns [[page|alias]]
.["page1","page2"]|wikilink
returns an array of wikilinks without aliases.["page1","page2"]|wikilink:"alias"
returns an array of wikilinks with the same alias for all links.{"page1": "alias1", "page2": "alias2"}|wikilink
returns wikilinks with the keys as page names and values as aliases.calc
Performs basic arithmetic operations on numbers.
+
, -
, *
, /
, **
(or ^
) for exponentiation.5|calc:"+10"
returns 15
.2|calc:"**3"
returns 8
(2 cubed).length
Returns the length of strings, arrays, or number of keys in objects.
"hello"|length
returns 5
.["a","b","c"]|length
returns 3
.{"a":1,"b":2}|length
returns 2
.round
Rounds a number to the nearest integer or to a specified number of decimal places.
3.7|round
returns 4
.3.14159|round:2
returns 3.14
.Process HTML content and convert HTML to Markdown. Note that your input variable must contain HTML content, e.g. using {{fullHtml}}
, {{contentHtml}}
or a {{selectorHtml:}}
variable.
markdown
Converts a string to an Obsidian Flavored Markdown formatted string.
{{contentHtml}}
, {{fullHtml}}
, and selector variables like {{selectorHtml:cssSelector}}
.remove_attr
Removes only the specified HTML attributes from tags.
"<div class="test" id="example">Content</div>"|remove_attr:"class"
returns <div id="example">Content</div>
.{{fullHtml|remove_attr:("class,style,id")}}
remove_html
Removes the specified HTML elements and their content from a string.
{{fullHtml|remove_html:("img,.class-name,#element-id")}}
strip_tags
or strip_attr
filters.remove_tags
Removes only the specified HTML tags. Keeps the content of the tags.
"<p>Hello <b>world</b>!</p>"|remove_tags:"b"
returns "<p>Hello world!</p>"
.{{fullHtml|remove_tags:("a,em,strong")}}
replace_tags
Replaces HTML tags, maintaining the content and attributes of the tag.
{{fullHtml|replace_tags:"strong":"h2"}}
replaces all <strong>
tags with <h2>
.strip_attr
Removes all HTML attributes from a string.
strip_attr:("class, id")
to keep specific attributes."<div class="test" id="example">Content</div>"|strip_attr:("class")
returns <div id="example">Content</div>
.strip_md
Removes all Markdown formatting and returns a plain text string, e.g. turning **text**
into text
.
strip_tags
Removes all HTML tags from a string. Content within the tag is preserved.
strip_tags:("p,strong,em")
to keep specific tags."<p>Hello <b>world</b>!</p>"|strip_tags:("b")
returns Hello <b>world</b>!
.Process arrays and objects.
first
Returns the first element of an array as a string.
["a","b","c"]|first
returns "a"
.join
Combines elements of an array into a string.
["a","b","c"]|join
returns "a,b,c"
.["a","b","c"]|join:" "
returns "a b c"
. Use join:"\n"
to separate elements with a line break.split
or slice
: "a,b,c,d"|split:","|slice:1,3|join:" "
returns "b c"
.last
Returns the last element of an array as a string.
["a","b","c"]|last
returns "c"
.map
Applies a transformation to each element of an array using the syntax map:item => item.property
or map:item => item.nested.property
for nested properties.
[{gem: "obsidian", color: "black"}, {gem: "amethyst", color: "purple"}]|map:item => item.gem
returns ["obsidian", "amethyst"]
.map:item => ({key: value})
, e.g.: [{gem: "obsidian", color: "black"}, {gem: "amethyst", color: "purple"}]|map:item => ({name: item.gem, color: item.color})
returns [{name: "obsidian", color: "black"}, {name: "amethyst", color: "purple"}]
.String literals are supported and automatically wrapped in an object with a str
property. The str
property is used to store the result of string literal transformations, e.g. ["rock", "pop"]|map:item => "genres/${item}"
returns [{str: "genres/rock"}, {str: "genres/pop"}]
.
Combine map
with the template
filter, e.g. map:item => ({name: ${item.gem}, color: item.color})|template:"- ${name} is ${color}\n"
.
merge
Adds new values to an array.
["a","b"]|merge:("c","d")
returns ["a","b","c","d"]
.["a","b"]|merge:"c"
returns ["a","b","c"]
."a"|merge:("b","c")
returns ["a","b","c"]
.["a"]|merge:('b,"c,d",e')
returns ["a","b","c,d","e"]
.nth
Keeps nth items in an array using CSS-style nth-child syntax and group patterns. All positions are 1-based (first item is position 1).
array|nth:3
keeps only the 3rd element.array|nth:3n
keeps every 3rd element (3, 6, 9, etc.).array|nth:n+3
keeps the 3rd and all following elements.Group pattern syntax for repeating structures:
array|nth:1,2,3:5
keeps positions 1, 2, 3 from each group of 5 items. Example: [1,2,3,4,5,6,7,8,9,10]|nth:1,2,3:5
returns [1,2,3,6,7,8]
.object
Manipulates object data:
object:array
converts an object to an array of key-value pairs.object:keys
returns an array of the object's keys.object:values
returns an array of the object's values.{"a":1,"b":2}|object:array
returns [["a",1],["b",2]]
.slice
Extracts a portion of a string or array.
"hello"|slice:1,4
returns "ell"
.["a","b","c","d"]|slice:1,3
returns ["b","c"]
."hello"|slice:2
returns "llo"
."hello"|slice:-3
returns "llo"
."hello"|slice:1,4
includes characters at indices 1, 2, and 3."hello"|slice:0,-2
returns "hel"
.split
Divides a string into an array of substrings.
"a,b,c"|split:","
returns ["a","b","c"]
."hello world"|split:" "
returns ["hello","world"]
."hello"|split
returns ["h","e","l","l","o"]
."a1b2c3"|split:[0-9]
returns ["a","b","c"]
.template
Applies a template string to an object or array of objects, using the syntax object|template:"Template with ${variable}"
.
{"gem":{"name":"Obsidian"}}|template:"${gem.name}"
returns "Obsidian"
.{"gem":"obsidian","hardness":5}|template:"${gem} has a hardness of ${hardness}"
returns "obsidian has a hardness of 5"
.[{"gem":"obsidian","hardness":5},{"gem":"amethyst","hardness":7}]|template:"- ${gem} has a hardness of ${hardness}\n"
returns a formatted list.Works with string literals from map
by accessing the str
property:
["rock", "pop"]|map:item => "genres/${item}"|template:"${str}"
returns "genres/rock\ngenres/pop"
.str
property is automatically used when applying template
to objects created by map
with string literals.unique
Removes duplicate values from arrays and objects.
[1,2,2,3,3]|unique
returns [1,2,3]
.[{"a":1},{"b":2},{"a":1}]|unique
returns [{"a":1},{"b":2}]
.